/**
 * 
 */
var homeView={
    //请求数据的方法
    getFilmlist:function(){
            // console.log(this);
            var self=this;
    var url='http://huruqing.cn:3000/api/film/getList';
    $.ajax({
    type:'get',
    url:url,
    date:{},
    dateType:'json',
    //success方法是请求成功后自动调用的方法,jq规定的
    success:function(res){
    console.log(res)
                    // 调用渲染列表的方法来渲染列表
                    var list=res.films;
                    self.renderList(list);
                    // 轮播图
                    self.carousel(res.banners);
    }
    });
    },
        // 渲染电影列表
        renderList(list){
            var str='';
            list.forEach(function(itme,index){
                str+=`<a href="./dianyinye.html?filmId=${itme.filmId}">
                <div class="alt">
                <img class=" ml-10 mt-10 " src="${itme.poster}" alt="">
                <div class="pp mt-15 ml-90">
                    <p class="mt-5 f20">${itme.name} <span>${itme.filmType}</span></p>
                    <p class="mt-8 f10">观众评分${itme.grade}</p>
                    <p class="mt-8 f10">演员：${itme.actorStr}</p>
                    <p class="mt-8 f10">${itme.nation}</p>
                </div>
                <button class="abs f10" >购买</button>
                </div>
                </a>`
            })
            document.querySelector('#app').innerHTML=str;
        },
        // 渲染轮播图
        carousel:function(imgList){
            var str='';
            imgList.forEach(function(itme){
                str+=`<div class="swiper-slide">
                <img src="${itme.url}"width="100%" alt=""></div>`;
            })
            document.querySelector('.swiper-wrapper').innerHTML=str;
        }
        
    }
    var mySwiper = new Swiper ('.swiper-container', {
        //   direction: 'vertical', // 垂直切换选项
          loop: true, // 循环模式选项
          
          // 如果需要分页器
          pagination: {
            el: '.swiper-pagination',
          }
        })        
    
    
    homeView.getFilmlist();